<template>
  <page title="年报明细" has-back>
    <h1>{{ part }} {{info.year}} 培训汇总</h1>
    <el-table :data="info.infoList" header-cell-class-name="table-header">
      <el-table-column
          prop="month"
          label="月份">
      </el-table-column>
      <el-table-column
          prop="departmentStatistic.project"
          label="承办项目数">
      </el-table-column>
      <el-table-column
          prop="departmentStatistic.people"
          label="培训人数">
      </el-table-column>
      <el-table-column
          prop="departmentStatistic.classroomUsage"
          label="使用教室（间次）">
      </el-table-column>
      <el-table-column
          prop="departmentStatistic.dormitoryUsage"
          label="使用宿舍（间夜）">
      </el-table-column>
    </el-table>
  </page>
</template>

<script>
import Page from "@/components/Page";
import axios from "axios";
import moment from "moment";
export default {
  name: "YearReportInfo",
  components: {Page},
  data(){
    return{
      date: new Date(),
      tableData:[{
        id:0,
        month:'一月',
        projects:51,
        people:12,
        classroom:23,
        dormitory:42,
      },{
        id:1,
        month:'二月',
        projects:51,
        people:12,
        classroom:23,
        dormitory:42,
      }],
      info:{
        year:'',
        infoList:[]
      },
      part:''
    }
  },
  methods:{
    findReportInfoByIdAndPart(id,part){
      axios.get(this.$host+"/report/year/"+id,{
        params:{
          part:part
        }
      }).then(response=>{
        if(response.data.code === 0){
          this.info = response.data.data;
          this.info.year = moment(this.info.year).format("YYYY");
          this.info.infoList.forEach(value => {
            value.month = this.localDateFormNumber(moment(value.month).format("M"));
          })
        }
      })
    },
    localDateFormNumber(monthNumber){
      console.log(monthNumber)
      monthNumber = Number(monthNumber);
      switch (monthNumber){
        case 1:return"一月"
        case 2:return"二月"
        case 3:return"三月"
        case 4:return"四月"
        case 5:return"五月"
        case 6:return"六月"
        case 7:return"七月"
        case 8:return"八月"
        case 9:return"九月"
        case 10:return"十月"
        case 11:return"十一月"
        case 12:return"十二月"
      }
    }
  },
  created(){
    let id = this.$router.currentRoute.value.query.id;
    let part = this.$router.currentRoute.value.query.part;
    this.part = part;
    this.findReportInfoByIdAndPart(id,part);
  }
}
</script>

<style scoped>

</style>